import React from 'react';
import ReactDom from 'react-dom';

var footerCss = require("../../css/footer.css");

export default class ComponentHeader extends React.Component {

    constructor(){
        super();
        this.state = {
            miniHeader : false
        };
    };

    switchHeader() {
        this.setState({
            miniHeader : !this.state.miniHeader
        });
    };

  render() {
      const styleComponentHeader = {
          header : {
              backgroundColor : "#333333",
              color: "#FFFFFF",
              paddingBottom: (this.state.miniHeader) ? '3px' : '15px',
              paddingTop: (this.state.miniHeader) ? '3px' : '15px',
          },
      };

    return (
      <header style={styleComponentHeader.header} className="smallFontSize" onClick={this.switchHeader.bind(this)}>
        <h1>这是头部</h1>
      </header>
    )
  }
}
